import React from 'react';
import {Button, Picker, Provider, List, WingBlank, Toast} from '@ant-design/react-native';
import {connect} from 'react-redux';
import {saveUserInfo} from '~/store/userinfo';
import {View} from 'react-native';

const mapGetter = (state) => {
    return {
        userinfo: state.userinfo,
    };
};

const mapSetter = (dispatch) => {
    return {
        onSave: (data) => {
            dispatch(saveUserInfo(data));
        },
    };
};

const roleList = [
    {
        label: '业主',
        value: 'k3c9ww4li',
    },
    {
        label: '开发商',
        value: 'kfwe93ls',
    },
    {
        label: '银行',
        value: 'i3ddv56as',
    },
    {
        label: '代理商',
        value: 'r2fnje02b',
    },
];
const ids = [8, 11, 21, 31];

class SelectRole extends React.Component {
    static navigationOptions = {
        title: '选择身份',
    };

    constructor(props) {
        super(props);
        this.state = {
            identitycode: '',
            identity: 0,
        };
        if (this.props.userinfo.token !== '') {
            this.props.navigation.navigate('NavigatorTab');
        }
    }

    setRole = (arr) => {
        let index = roleList.findIndex((item) => item.value === arr[0]);
        this.setState({
            identitycode: arr[0],
            identity: ids[index],
        });
    };

    toHome = () => {
        if (this.state.identitycode !== '') {
            const data = {
                identitycode: this.state.identitycode,
                identity: this.state.identity,
            };
            this.props.onSave(data);
            this.props.navigation.navigate('NavigatorTab');
        } else {
            Toast.info('请选择用户角色', 1);
        }
    };

    render() {
        return (
            <>
                <View style={{backgroundColor: 'white', justifyContent: 'center'}}>
                    <WingBlank>
                        <Picker data={roleList} cols={1} value={[this.state.identitycode]} onChange={this.setRole}>
                            <List.Item>用户角色</List.Item>
                        </Picker>
                        <Button onPress={this.toHome}>下一步</Button>
                    </WingBlank>
                </View>
            </>
        );
    }
}

export default connect(mapGetter, mapSetter)(SelectRole);
